.page {
  --color-primary: #{$color-primary}; // 主题颜色
  --text-color: #303133; // 文字颜色
  --text-color-secondary: #606266; // 次要文字颜色
  --text-color-highlight: #ffffff; // 高亮文本颜色
  --text-color-title: #ffffff; //  标题文本颜色
  --font-size: 28rpx; // 字体大小
  --border-color: #74efff; // 边框颜色
  --border: 8rpx; // 边框颜色
  --background-color: #{$color-primary}; // 页面背景颜色
  --background-image: none; //  页面背景图片
  --card-background-color: #ffffff; //   卡片背景颜色
  --card-padding: 20rpx; // 卡片内边距
  --border-radius: 20rpx; // 卡片圆角
  --line-height: 1.5; // 行高

  min-height: 100vh;
  min-height: 100vh;
  // 安全区域
  padding-bottom: 50rpx;
  padding-bottom: calc(env(safe-area-inset-bottom) + 20rpx);

  background-size: 100% 100%;
  background-repeat: no-repeat;
  position: relative;

  font-size: $font-size-base;
  &-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    image {
      width: 100%;
      height: 100%;
    }
  }
}

.wrapper {
  background-color: $wrapper-bg;
  width: 100%;
  height: 100%;
  min-height: 100vh;
}

.container {
  width: 100%;
  height: 100%;
  padding: $padding;
}
